@extends('www/zc-666/layout')
@section('title','好有留言')

@section('content')
    <style>body{background-color: #f3f3f3;}</style>
    <div class="order">
        {{--支持者列表--}}
        <div class="supports">
            @foreach($supports as $sup)
                <div class="chart-box">
                    {{--头像--}}
                    @if($sup->is_annoymous == 0)
                        <div class="chart-head"><img src="{{$sup->wx_head}}"></div>
                    @else
                        <div class="chart-head"><img src="/www/zc666/images/common/default-head.png"></div>
                    @endif

                    {{--消息盒子--}}
                    <div class="chart-content-box">
                        <div>
                            <img class="top-img" src="/www/zc666/web/img/san.png" />
                        </div>

                        <div class="inner-box">
                            {{--支持金额--}}
                            <p class="supporter-name flex">
                                <span class="name1 flex1">{{$sup->wx_name}}</span>
                                <span class="name2">支持:<span>{{$sup->pay_money}}元</span></span>
                            </p>

                            <p class="msg">{{$sup->message ? $sup->message : "看好你哦！"}}</p>

                            <p class="time">
                                <span>{{$sup->created_at}}</span>
                                @if($orderInfo->open_id == $userInfo['openid'])
                                    <img src="/www/zc666/web/img/msg.png" onclick="order.show_comment_input({{$sup->id}})">
                                @endif
                            </p>

                            {{--子评论列表--}}
                            @foreach($sup->comments as $com)
                                <div class="reply-list" id="pay-{{$sup->id}}">
                                    <p class="supporter-name">
                                        <span class="name1">{{$com->wx_name}}</span>
                                    </p>
                                    <p class="msg">{{$com->content}}</p>
                                    <p class="time">
                                        <span>{{$com->created_at}}</span>
                                    </p>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            @endforeach
        </div>

        <!-- 评论输入框 -->
        <div class="add-comment-box hide" ontouchstart="order.close_comment_input()">
            <div class="add-comment" ontouchstart="stop_event(event)">
                <div style="margin: 20px;">
                    <p style="color: #000;font-size: 14px;">回复留言</p>
                    <textarea id="commentinput"></textarea>
                </div>
                <p class="btns">
                    <text class="btn-cancel" onclick="order.close_comment_input()">取消</text>
                    <text onclick="order.add_comment()">回复</text>
                </p>
            </div>
        </div>
    </div>

    <script>
        window.onload = function(){
            @if($orderInfo->open_id == $userInfo['openid'])
                const title   = "我是{{$orderInfo->real_name}}，正在参加{{$activity->share_title}}";
                const desc    = "{{$activity->share_desc}}";
            @else
                const title   = "我的好友{{$orderInfo->real_name}}正在参加{{$activity->share_title}}";
                const desc    = "{{$activity->share_desc}}";
            @endif

            const groupTitle = title;
            const link    = appRoot + "www/zhongchou666/order?orderId={{$orderInfo->id}}";
            const imgUrl  = appRoot + "{{$activity->share_img}}";

            @if(is_online() && is_weixin())
                wx.config(<?php echo $weixinJs->config(array('onMenuShareAppMessage', 'onMenuShareTimeline'), false) ?>);
                wx.ready(function(){
                    set_wx_share(title,groupTitle,desc,imgUrl,link);
                });
            @endif
        }
    </script>
@endsection
